<template>
  <!-- <div>音乐播放界面</div> -->
  <MusicPlayer :musicDetail="musicDetail" />
</template>

<script setup>
import { reactive } from 'vue'
import { useRoute } from 'vue-router'

const route = useRoute()
const index = route.query.musicID
console.log('播放', index)

const musicDetail = reactive({
  musicID: index,
  musicName: '123',
  musicSinger: '123',
  musicUrl: '123',
  musicImg: 'https://web-tilas4854.oss-cn-beijing.aliyuncs.com/swiper/4.png',
  musicLyric: [
    '第一行歌词',
    '第二行歌词',
    '第三行歌词',
    '第四行歌词',
    '第五行歌词',
    '...',
    '第一行歌词',
    '第二行歌词',
    '第三行歌词',
    '第四行歌词',
    '第五行歌词',
    '...',
    '第一行歌词',
    '第二行歌词',
    '第三行歌词',
    '第四行歌词',
    '第五行歌词',
    '...',
    '第一行歌词',
    '第二行歌词',
    '第三行歌词',
    '第四行歌词',
    '第五行歌词',
    '...',
    '第一行歌词',
    '第二行歌词',
    '第三行歌词',
    '第四行歌词',
    '第五行歌词',
    '...'
  ],
  musicContainSong: [
    {
      playlistID: 1,
      playlistImg: 'https://web-tilas4854.oss-cn-beijing.aliyuncs.com/swiper/1.png',
      playlistText: '如何评价 11 月 14 日正式...'
    },
    {
      playlistID: 2,
      playlistImg: 'https://web-tilas4854.oss-cn-beijing.aliyuncs.com/swiper/4.png',
      playlistText: '午睡是不是一个「伪需求...'
    },
    {
      playlistID: 3,
      playlistImg: 'https://web-tilas4854.oss-cn-beijing.aliyuncs.com/swiper/2.png',
      playlistText: '温柔晚安曲 | 我想在梦里...'
    }
  ]
})
</script>

<style lang="scss" scoped></style>
